<template>
	<div class="layout">
        <div class="layout-ceiling">
            <div class="layout-header">
                 <span>MEX后台管理系统</span>
            </div>
            <div class="layout-ceiling-main">
              <span><a style="color: cornflowerblue">用户名:{{username}} </a> |</span>
              <a  @click="loginOut" >退出</a> |
            </div>
        </div>
    </div>
</template>
<script type="text/javascript">
	export default{
        data(){
          return{
            username:'',
            shows:''
          }
        },
        methods:{
          /*登出*/
          loginOut:function () {
            var _self = this;
            _self.$http.post(_self.service+'/user/loginOut')
              .then(function (res) {
                if(res.data.code == '001'){
                  _self.$Message.success('退出成功！');
                  _self.$http.defaults.headers.common['userId'] =_self.cookie.getCookie('') ;
                  _self.$http.defaults.headers.common['ticket'] = _self.cookie.getCookie('');
                  _self.cookie.clearCookies();
                  _self.$router.push({path:'/login'})
                }else{
                  alert("ssss")
                }
              })
            /*
            _self.$http.post(_self.service + '/userAuth/loginOut').then(function (res) {
              if(res.data.code == '001'){
                _self.$Message.success('退出成功！');
                _self.$http.defaults.headers.common['userId'] =_self.cookie.getCookie('') ;
                _self.$http.defaults.headers.common['ticket'] = _self.cookie.getCookie('');
                _self.cookie.clearCookies();
                _self.$router.push({path:'/login',query:{}})

              }
            })

            * */
          },
          /*用户信息展示*/
          showUserData:function () {
            var _self = this;
            _self.username = _self.$http.defaults.headers.common['account'] =this.cookie.getCookie('account').replace(/\"/g, "");
          },
          /*判断cookie 跳转到login*/
          /*optionLogin:function () {
              var _self = this;
              if(_self.username == '')
                _self.$router.push({path:'/login'})
          }*/
        },
    beforeMount:function () {
          this.showUserData()
      },

	}

</script>

<style scoped>
    .layout{
        /*border: 1px solid #d7dde4;*/
        background: #f5f7f9;
        position: relative;
        border-radius: 4px;
        overflow: hidden;
        width: 100%;
        float:right;
        z-index: 10;

    }
    .layout-logo{
        width: 100px;
        height: 80px;
        background: #5b6270;
        border-radius: 3px;
        float: left;
        position: relative;
        top: 15px;
        left: 20px;
    }
    .layout-header{
        height: 60px;
        background: #fff;
        box-shadow: 0 1px 1px rgba(0,0,0,.1);
    }
    .layout-copy{
        text-align: center;
        padding: 20px 0 20px;
        color: #9ea7b4;
    }
    .layout-ceiling{
        background: #464c5b;
        padding: 20px 0;
        overflow: hidden;
        font-size: 18px;
    }
    .layout-ceiling-main{
        float: right;
        margin-right: 15px;
    }
    .layout-ceiling-main a{
        color: #9ba7b5;
    }
    .layout-header{
      float:left;
      margin-left: 6%;
      font-size: 36px;
      font-weight: 500;
      background-color: #464c5b;
      color: #fff;
      font-family: "微软雅黑";
    }
</style>
